<template>
  <div>
    <!-- 其他信息 -->
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>其他信息</span>
      </div>
      <div class="form-container" style="margin-bottom: 200px;">
        <el-form ref="otherForm" :model="otherForm" label-width="200px" class="demo-ruleForm" size="small">
          <el-form-item label="上架时间:" prop="state">
            <el-radio-group v-model="otherForm.state">
              <el-radio :label="0">立即上架售卖</el-radio>
              <el-radio :label="1">暂不售卖，放入仓库</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="第三方产品链接：">
            <div>
              <!--遍历-->
              <span v-for="item in otherForm.relation_card_list" :key="item.uuid" style="width: 70%;">
                <el-input v-model="item.relation_card_url" placeholder="请输入" style="width: 70%;margin-bottom: 10px;"/>
              </span>
              <span style="width: 20%;margin-left: 10px;">
                <el-button type="primary" size="mini" @click="addCardUrl">添加</el-button>
              </span>
            </div>
          </el-form-item>
        </el-form>
      </div>
    </el-card>
  </div>
</template>
<script>
export default {
  props: {
    form: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now()
        }
      },
      otherForm: {
        state: 0,
        relation_card_list: []
      },
      msgMap: {
        'state': '请选择上架时间',
        'advance_sale_check': '请选择预售时间',
        'home_purchase_restrictions_check': '请填写限购数量',
        'start_selling_count': '请填写起售件数',
        'msg': '起售不能大于限购'
      }
    }
  },
  computed: {
    errorList() {
      const { state, listing_time, advance_sale_check, advance_sale_state, advance_sale_time, advance_sale_day, home_purchase_restrictions_check, home_purchase_restrictions_state, home_purchase_restrictions_count, start_selling_count } = this.otherForm
      const ret = []
      if (state === 2 && !listing_time) {
        console.log(state, listing_time)
        ret.push('state')
      }
      if ((advance_sale_check && !advance_sale_state) || (advance_sale_check && advance_sale_state === 1 && !advance_sale_time) || (advance_sale_check && advance_sale_state === 2 && !advance_sale_day)) {
        ret.push('advance_sale_check')
      }
      if (home_purchase_restrictions_check && (!home_purchase_restrictions_state || !home_purchase_restrictions_count)) {
        ret.push('home_purchase_restrictions_check')
      }
      if (home_purchase_restrictions_count && start_selling_count && (start_selling_count > home_purchase_restrictions_count)) {
        ret.push('msg')
      }
      return ret
    }
  },
  watch: {
    form(value) {
      this.otherForm = value
    },
    otherForm: {
      handler(form) {
        if (form.state !== 2) {
          form.listing_time = ''
        }
        if (!form.advance_sale_check) {
          form.advance_sale_state = ''
          form.advance_sale_time = ''
          form.advance_sale_day = ''
        } else {
          form.advance_sale_day = form.advance_sale_state === 1 ? '' : form.advance_sale_day
          form.advance_sale_time = form.advance_sale_state === 2 ? '' : form.advance_sale_time
        }
        if (!form.home_purchase_restrictions_check) {
          form.home_purchase_restrictions_state = ''
          form.home_purchase_restrictions_count = ''
        }
      },
      deep: true
    }
  },
  methods: {
    sendOther() {
      this.$emit('other', this.otherForm)
    },
    addCardUrl() {
      const info = {
        uuid: this.generateUUID(),
        relation_card_url: ''
      }
      this.otherForm.relation_card_list.push(info)
    },
    // 生成唯一id
    generateUUID() {
      var d = new Date().getTime()
      if (window.performance && typeof window.performance.now === 'function') {
        d += performance.now() // use high-precision timer if available
      }
      var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        var r = (d + Math.random() * 16) % 16 | 0
        d = Math.floor(d / 16)
        return (c === 'x' ? r : (r & 0x3 | 0x8)).toString(16)
      })
      return uuid
    }
  }
}
</script>
